<template>
	<xbd-pages-content title="修改密码">
		<template #default>
			<uni-nav-bar left-icon="back" right-text="保存" title="修改密码"  @clickLeft="clickLeft" @clickRight="clickRight" color="#394954" backgroundColor="#F8F8F8"></uni-nav-bar>
		</template>
		<template #content>
			<view class="edit-password">
				<view class="row">
					<view class="title">
						原密码
					</view>
					<uni-easyinput type="password" v-model="formData.password" placeholder-style="color: #999999;" placeholder="请输入原密码" />
				</view>
				<view class="row">
					<view class="title">
						新密码
					</view>
					<uni-easyinput type="password" v-model="formData.newPassword"  placeholder-style="color: #999999;" placeholder="8-32位字母、数字、下划线的组合" />
				</view>
				<view class="row">
					<view class="title">
						重复新密码
					</view>
					<uni-easyinput type="password" v-model="formData.newPasswordToo"  placeholder-style="color: #999999;" placeholder="请再次输入新密码" />
				</view>
			</view>
		</template>
	</xbd-pages-content>
</template>

<script>
	export default {
		data() {
			return {
				formData: {
					password: '',
					newPassword: '',
					newPasswordToo: ''
				}
			};
		},
		methods: {
			clickLeft() {
				uni.navigateBack({
					delta: 1
				});
			},
			clickRight() {
				// 密码校验
				const reg = /[a-zA-Z0-9_]$/g;
				const flag = !reg.test(this.formData.newPassword);
				if (this.formData.password === '') {
					return this.$showToast('请先输入旧密码！');
				} else if (this.formData.newPassword === '') {
					return this.$showToast('请先输入新密码！');
				} else if (this.formData.newPasswordToo === '') {
					return this.$showToast('请再次输入新密码！');
				} else if (!(this.formData.newPassword.length >= 8 && this.formData.newPassword.length <= 32)) {
					return this.$showToast('新密码长度为8-32位！');
				} else if (flag) {
					return this.$showToast('新密码为数字字母下划线组合！');
				} else if (this.formData.newPasswordToo !== this.formData.newPassword) {
					return this.$showToast('新密码与旧密码输入不一致！');
				}
				try {
				    uni.removeStorageSync('token');
				    uni.removeStorageSync('userInfo');
				} catch (e) {
				    // error
				}
				this.$showToast('修改成功！');
				uni.reLaunch({
					url: '/pages/login/login',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .uni-nav-bar-right-text {
		font-size: 14px;
		
		color: $uni-color-primary;
	}
	.edit-password {
		padding: 10px 50rpx;
		
		background-color: #FFFFFF;
		.row {
			display: flex;
			align-items: center;
			padding: 10px 0;
			.title {
				width: 190rpx;
				text-align: left;
				
				font-size: 14px;
				
				color: $uni-text-color;
			}
			.uni-easyinput {
				font-size: 12px !important;
				
				color: $uni-text-color !important;
			}
		}
	}
</style>
